---
layout: default
---
<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">

	<header class="post-header">
		<link rel="stylesheet" href="/css/font_size.css" />
		<link rel="stylesheet" href="/css/style.css" />
		<link rel="stylesheet" href="/css/topics.css" />
		
		{% if page.keywords %}
			<meta name="keywords" content="{{ page.keywords | join: ', ' | escape }}">
		{% endif %}
		<p class="post-meta">
		<time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
			{%- assign date_format = site.minima.date_format | default: "%A, %B %-d, %Y" -%}
			{{ page.date | date: date_format }}
		</time>
			{%- if page.author -%}
			• by <span itemprop="author" itemscope itemtype="http://schema.org/Person"><span class="p-author h-card" itemprop="name">{{ page.author }}</span></span>
	      {%- endif -%}</p>
	</header>

	<div itemprop="articleBody">
		<!-- <img src="/images/page_headers/by_topic_page_header_860x130.png"> masthead logo -->
		{{- content -}}
		<!-- find out if there are posts and, if so, sort them into a collection -->		
		{%- if site.posts.size > 0 -%}
			{%- assign posts_by_topic = site.posts | group_by: 'topic' | reverse -%}
			{% capture tags %}
				{%- for tag in site.tags -%}
					tag
				{%- endfor -%}
			{% endcapture %}
			<!-- build the topics menu -->
			<BR>
			<div class="topics-menu">
				{%- for tag in site.tags -%}
					<!-- build the current topic color as the variable 'topic_color' -->
					 <!-- grab the topic name from the current post -->
					{% capture topic_color %}
						{{- tag[0] -}}
					{% endcapture %}
					<div>
						<a href="#{{ tag[0] }}"> <!-- Build a link that will auto-scroll to the topic heading. -->
							 <img class="topic-icon" src="/images/topics/{{ tag[0] }}.png" alt="{{ tag[0] | capitalize }}">
						</a>
						<p align="center" class="{{topic_color}}_font-color">{{ tag[1].size }}</p>
					</div>
				{%- endfor -%}
			</div>
			<BR>
			<HR>
			<BR>
			<!-- list of posts sorted by topic -->
			{%- for tag in site.tags -%}
				{% capture topic_color %} <!-- build the current topic color as the variable 'topic_color' -->
					{{- tag[0] -}} <!-- grab the topic name from the current post -->
				{% endcapture %}

				{%- assign current-topic-color = tag[0] -%}  <!-- Get the tag name. -->
				<!-- Build a header for each topic. -->
				<div>
					<a id="{{tag[0]}}">
					<span> {{ post.date | date: date_format }} <!-- Grab the post's date. -->
						<div class="{{current-topic-color}} topic-header"></div>
					</span>
					<span class="topic-span-icon">
						<img src="/images/topics/{{tag[0]}}.png">
					</span>
				</div>

				 <!-- List of posts for the current topic. -->
				<ul class="{{tag[0]}}-post-list post-list">
				 <!-- List the posts in each topic. -->
				{%- for post in tag[1] reversed -%}
					<li>
						{%- assign date_format = site.minima.date_format | default: "%A, %B %-d, %Y" -%}
						<div class="post-topic">
							<div class="post-info">
								<div class="post-topic-date">
									{{- post.date | date: "%A, %B %-d, %Y" -}} <!-- date of post -->
								</div>
								<div class="post-link">
									<a href="{{ post.url | relative_url }}"</a> <!-- build page URL -->
									{{- post.title -}} <!-- title text -->
								</div>
								<BR>
								<div class="post-blurb">
									{{- post.description -}}
								</div>
							</div>
						</div>
					</li>
				{% endfor %}
				</ul>
				<a href="#top" align="right">Return to Top of Page</a>
				<div class="post-color-fade-topic"> <!-- This is just a spacer now. -->
				</div>
			{%- endfor -%}
		{%- endif -%}
		{%- include post-footer.html -%}
	</div>

	<a class="u-url" href="{{ page.url | relative_url }}" hidden></a>
</article>


















































